<template>
  <div>
    <FormPanel ref="from" :list="formList" @formChange="changeHandle" :isSubmitBtn="false" :collapse="false" labelWidth="110" />
    <TopFilter :list="topFilterList" :cols="3" @filterChange="changeHandles" :collapse="false"></TopFilter>
    <div>
      <!-- <ul>
        <li v-for="city in List" :key="city.type" style="overflow:hidden;margin-bottom:20px;">
          <div style="clear:both;float:left;margin-top:6px;">
            <el-checkbox v-model="city.is"></el-checkbox>
        </div>
          <div style="float:left;overflow:hidden;"> -->
      <el-tree ref="tree" :data="List" :props="defaultProps" show-checkbox node-key="code" @check="handleCheckChanges" @check-change="checkChange"></el-tree>
      <!-- </div>
        </li>
      </ul> -->
    </div>
    <div></div>
    <div
      :style="{
        position: 'absolute',
        left: 0,
        bottom: 0,
        right: 0,
        zIndex: 9,
        borderTop: '1px solid #e9e9e9',
        padding: '10px 20px',
        background: '#fff',
        textAlign: 'right'
      }"
    >
      <el-button @click="closeDrawer(1)">关 闭</el-button>
      <!-- <el-button @click="closeDrawer(2)" type="primary">保 存</el-button> -->
      <multiuse-button type="primary" :click="closeDrawer.bind(this, 2)">保 存</multiuse-button>
    </div>
  </div>
</template>
<script>
import { dictionary } from '@/utils/dictMixin';
import moment from 'moment';
import { getDetail, postSave, getTree } from '@/api/omSale/vehicleParameters/wholesaleProducts';
export default {
  data() {
    this.saveData = null;
    return {
      formList: this.createdFrom(),
      topFilterList: this.createdTop(),
      selectList: [],
      List: [],
      checkList: [],
      defaultProps: {
        children: 'children',
        label: 'name'
      }
    };
  },
  mixins: [dictionary],
  created() {
    this.getTreeList();
  },
  methods: {
    createdFrom() {
      return [
        {
          type: 'BREAK_SPACE',
          label: '产品组信息'
        },
        {
          type: 'INPUT',
          label: '产品组代码',
          fieldName: 'groupCode',
          placeholder: '请选择',
          disabled: true
        },
        {
          type: 'INPUT',
          label: '产品组名称',
          fieldName: 'groupName',
          placeholder: '请输入',
          rules: [{ required: true, message: '请输入', trigger: 'blur' }]
        },
        {
          type: 'SELECT',
          label: '启用标记',
          fieldName: 'status',
          placeholder: '请选择',
          itemList: this.createDictList('1003'),
          initialValue: 10031001,
          rules: [{ required: true, message: '请选择', trigger: 'change' }]
        },
        {
          type: 'DATE',
          label: '生效日期',
          fieldName: 'startDate',
          placeholder: '请选择',
          initialValue: moment().format('YYYY-MM-DD'),
          dateType: 'exactdate',
          rules: [{ required: true, message: '请选择', trigger: 'change' }]
        },
        {
          type: 'DATE',
          label: '失效日期',
          fieldName: 'endDate',
          placeholder: '请选择',
          dateType: 'exactdate',
          initialValue: '9999-12-31',
          rules: [{ required: true, message: '请选择', trigger: 'change' }],
          offsetRightCols: 1
        },
        {
          type: 'TEXT_AREA',
          label: '备注',
          fieldName: 'remark',
          placeholder: '请输入',
          selfCols: 3
        },
        {
          type: 'BREAK_SPACE',
          label: '授权选择清单',
          placeholder: '请选择'
        }
      ];
    },
    createdTop() {
      return [
        {
          type: 'INPUT',
          label: '选装代码',
          fieldName: 'optionCode',
          placeholder: '请选择'
        },
        {
          type: 'INPUT',
          label: '产品代码',
          fieldName: 'productCode',
          placeholder: '请选择'
        }
      ];
    },
    async getTreeList(data = {}) {
      let res = await getTree(data);
      res.data.map(x => {
        if (x.name == '60081001') {
          x.name = '燃油车';
        } else if (x.name == '60081002') {
          x.name = '新能源';
        } else {
          x.name = '无动力形式';
        }
      });
      res.data.map(x => {
        // 1
        x.is = false;
        x.ischeck = false;
        if (x.children) {
          // 2
          x.children.map(y => {
            // 3
            y.is = false;
            y.ischeck = false;
            if (y.children) {
              // 4
              y.children.map(q => {
                // 5
                q.is = false;
                q.ischeck = false;
                if (q.children) {
                  q.children.map(w => {
                    w.is = false;
                    w.ischeck = false;
                    if (w.children) {
                      w.children.map(t => {
                        // 6
                        t.is = false;
                        t.ischeck = false;
                        if (t.children) {
                          t.children.map(u => {
                            u.is = false;
                            u.ischeck = false;
                          });
                        }
                      });
                    }
                  });
                }
              });
            }
          });
        }
      });
      this.List = res.data || [];
      console.log(res.data);
    },
    changeHandle(val) {
      this.saveData = val;
    },
    changeHandles(val) {
      this.getTreeList(val);
    },
    async closeDrawer(type) {
      if (type == 1) {
        this.$emit('close');
      } else {
        if (this.checkList.length < 1) {
          this.$notify.error({
            title: '错误',
            message: '请选择授权'
          });
          return;
        }
        this.$refs.from.SUBMIT_FORM();
        console.log(this.saveData, 'this.saveData');
        if (this.saveData) {
          let json = JSON.parse(JSON.stringify(this.saveData));
          if (new Date(json.startDate).getTime() >= new Date(json.endDate).getTime()) {
            this.$notify.error({
              title: '错误',
              message: '生效日期应小于失效日期'
            });
            this.saveData = null;
            return;
          }
          json.childrens = this.changedata();
          let res = await postSave(json);
          if (res.resultCode == 200) {
            this.$notify({
              title: '成功',
              message: '保存成功',
              type: 'success'
            });
            this.$emit('close', json);
          } else {
            this.saveData = null;
          }
        }
      }
    },
    handleCheckChanges(data, json) {
      // is表示被操作过
      this.checkList = json.checkedNodes;
    },
    checkChange(data, is, ischilrden) {
      console.log(data, is);
      data.is = is;
    },
    changedata(list) {
      let arr = this.$refs.tree.getHalfCheckedNodes(); //获取半选数据
      let arrays = [];
      this.List.map(x => {
        // 1
        if (x.is) {
          arrays.push(x);
        } else {
          console.log(this.isInArray(arr, x), x);
          if (this.isInArray(arr, x)) {
            if (x.children && x.children.length > 0) {
              x.children.map(y => {
                // 2
                if (y.is) {
                  arrays.push(y);
                } else {
                  if (this.isInArray(arr, y)) {
                    if (y.children && y.children.length > 0) {
                      y.children.map(q => {
                        //  3
                        if (q.is) {
                          arrays.push(q);
                        } else {
                          console.log(arr, q, 'arr,q');
                          if (this.isInArray(arr, q)) {
                            if (q.children && q.children.length > 0) {
                              q.children.map(w => {
                                // 4
                                if (w.is) {
                                  arrays.push(w);
                                } else {
                                  if (this.isInArray(arr, w)) {
                                    if (w.children && w.children.length > 0) {
                                      w.children.map(t => {
                                        // 5
                                        if (t.is) {
                                          arrays.push(t);
                                        } else {
                                          if (t.children && t.children.length > 0) {
                                            t.children.map(u => {
                                              // 6
                                              if (u.is) {
                                                arrays.push(u);
                                              }
                                            });
                                          }
                                        }
                                      });
                                    }
                                  }
                                }
                              });
                            }
                          }
                        }
                      });
                    }
                  }
                }
              });
            }
          }
        }
      });
      console.log(arrays, arr, this.List, 'arrays');
      return arrays;
    },
    isInArray(list, data) {
      // list是否包含arr里的数据
      let is = false;
      list.map(x => {
        if (x.code == data.code) {
          is = true;
        }
      });
      return is;
    }
  }
};
</script>
